<template>
  <div>1212</div>

  <el-upload
    v-model:file-list="fileList"
    list-type="picture-card"
    :auto-upload="false"
    :on-preview="handlePictureCardPreview"
    :on-remove="handleRemove"
    :on-change="handleChange"
  >
    <el-icon><Plus /></el-icon>
  </el-upload>
</template>

<script setup lang="ts">
import { ref, reactive, onMounted } from 'vue'
import { Plus } from '@element-plus/icons-vue'
import { upload, signature } from '@a/findList'
import type { UploadProps, UploadUserFile } from 'element-plus'

const dialogImageUrl = ref('')

const state = reactive({
  signature: {}
})
const dialogVisible = ref(false)

const fileList = ref<UploadUserFile[]>([])

const handleRemove: UploadProps['onRemove'] = (uploadFile, uploadFiles) => {
  console.log(uploadFile, uploadFiles)
}

const handlePictureCardPreview: UploadProps['onPreview'] = (uploadFile) => {
  dialogImageUrl.value = uploadFile.url!
  dialogVisible.value = true
}

const handleChange = (uploadFile: UploadFile, uploadFiles: UploadFiles) => {
      console.log(uploadFile);
      const { dir, token } = state.signature
      const { name, raw } = uploadFile
      const fd = new FormData()
      const file = raw
      fd.append('name', name)
      fd.append('key', `${dir}/1760956856117fzpd9cl8.jpg`)
      fd.append('dir', dir)
      fd.append('token', token)
      fd.append('response', 'inner')
      fd.append('file', file)

      upload(fd).then(res => {

      })
}

onMounted(() => {
  const fd = new FormData()
  fd.append('action', 'zero');
  fd.append('type', 'all');
  fd.append('token', '');

  signature(fd).then(res => {
    console.log(res, 'sss')
    const data = res.data
    state.signature = data.message
  })
})
</script>

<style lang="scss" scoped>

</style>